import IndexSwiper from "./components/IndexSwiper";
import CardList from "./components/CardList";
import "taro-ui/dist/style/components/button.scss"; // 按需引入
import CartFlexButton from "../../components/CartFixedButton";
import "./index.scss";
import { Remarkable } from "remarkable";
import CategoryTabs from "./components/CategoryTabs";
import { AtNoticebar } from "taro-ui";

import { getIndexNotice } from "../../api/notice";
import { useEffect, useState } from "react";
import { View } from "@tarojs/components";

export default () => {
  const [notice, SetNotice] = useState<string>();
  useEffect(() => {
    getIndexNotice().then(resp => {
      SetNotice(resp.noticeContent);
    });
  }, []);

  const showhtml = htmlString => {
    var html = { __html: htmlString };
    return <View dangerouslySetInnerHTML={html}></View>;
  };

  return (
    <view className="Wrapper">
      <AtNoticebar marquee>{showhtml(notice)}</AtNoticebar>
      <IndexSwiper></IndexSwiper>
      <CategoryTabs />
      <CardList />
      <CartFlexButton />
    </view>
  );
};
